<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>

	<head lang="en">
		<meta charset="UTF-8">
		<meta name="viewport" content="width=640, user-scalable=0">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta http-equiv="Expires" CONTENT="-1">
		<meta http-equiv="Cache-Control" CONTENT="no-cache">
		<meta http-equiv="Pragma" CONTENT="no-cache">
		<title></title>
		<style type="text/css">
			* {
				margin: 0px;
				padding: 0px;
			}
			
			html {
				overflow: hidden;
				font-size: 16px;
				height: 100%;
				width: 100%;
				font-family: Microsoft YaHei, ;
			}
			
			body {
				color: #333;
				background: url("<%=basePath%>/share/images/bj.jpg") no-repeat center top;
				background-size: cover;
				width: 100%;
				height: 100%;
			}
			
			img {
				border: none;
				vertical-align: text-bottom;
			}

			
			.logoWord {
				padding-top: 100px;
			}
			
			.btnOut {
				display: flex;
				justify-content: center;
				height: 247px;
			}
			
			.btnOut a {
				height: 73px;
				width: 247px;
				margin: 0 25px;
			}
			
			.btnOut .f_l {
				background: url("<%=basePath%>/share/images/ios.png") no-repeat;
				background-size: contain;
			}
			
			.btnOut .f_r {
				background: url("<%=basePath%>/share/images/anzhuo.png") no-repeat;
				background-size: contain;
			}
			
			.tips {
				width: 100%;
				display: none;
				padding: 0;
				font-size: 2.5rem;
				color: #fff;
				position: absolute;
				z-index: 5;
				left: 0;
				top: 0;
				background: rgba(0, 0, 0, 0.8);
			}
			
			.arrowOut {
				width: 100%;
				float: left;
			}
			
			.arrowUp {
				width: 122px;
				height: 185px;
				float: right;
				margin: 20px;
				background: url("<%=basePath%>/share/images/arrowUp.png") no-repeat;
				background-size: contain;
			}
			
			.ios,
			.android {
				display: none;
			}
			
			.tipList {
				width: 535px;
				height: 130px;
				margin: 0 auto;
			}
			
			.tipList img {
				width: 100%;
				float: left;
			}
			.wrapper{
				width: 100vw;
				height: 100vh;
				box-sizing: border-box;
				display: flex;
				justify-content: space-between;
				flex-direction: column;
				align-items: center;
			}
		</style>

	</head>

	<body>

		<div class="wrapper">
			<img src="<%=basePath%>/share/images/logoWord.png" class="logoWord"/>
			<img src="<%=basePath%>/share/images/xsgLogo.png" class="xsgLogo"/>
			<div class="btnOut">
				<a class="f_l" href="javascript:;"></a>
				<a class="f_r" href="javascript:;"></a>
			</div>
		</div>
		<div class="tips">
			<div class="arrowOut">
				<div class="arrowUp"></div>
			</div>
			<div class="tipList android"><img src="<%=basePath%>/share/images/shareTipAndroid.png" /></div>
			<div class="tipList ios"><img src="<%=basePath%>/share/images/shareTipIos.png" /></div>
		</div>
		<script src="<%=basePath%>/share/js/jquery-2.1.3.min.js"></script>
		<script type="text/javascript">
			var grayH = $(document).height();
			$('.f_r').click(function()
			{
				if(isWechat()){
					$('.tips').show().css({'height':grayH});
					$('.android').show();
					$('.ios').hide();
				}else{
					var $a = document.createElement('a');
					$a.download = 'sw.apk';
					$a.target = '_blank';
					$a.href = '<%=basePath%>/share/sw.apk';
					var evt = new MouseEvent('click', {
					    view: window,
					    bubbles: true,
					    cancelable: false
					});
					$a.dispatchEvent(evt);
				}
			})
			$('.f_l').click(function()
			{
				if(isWechat()){
					$('.tips').show().css({'height':grayH});
					$('.android').hide();
					$('.ios').show();
				}else{
					window.location.href="https://itunes.apple.com/us/app/守望app/id1344761998?l=zh&ls=1&mt=8";
				}
			})
			$('.tips').click(function()
			{
				$(this).hide();
			})
			
			function isWechat(){
				//判断是否是微信浏览器
		   		var ua = navigator.userAgent.toLowerCase(); 
		   		if(ua.match(/MicroMessenger/i)=="micromessenger") {  
		   			return true;
		   	    } else {
		   	    	return false;
		   	    } 
			}			
		</script>
	</body>

</html>